<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>文档标题</title>
    <link rel="stylesheet" href="index.css">
</head>
<body>
<div class="slider">
    <ul>
        <li><a href="#"><img src="img/fq1.jpg" alt=""></a></li>
        <li><a href="#"><img src="img/fq2.jpg" alt=""></a></li>
        <li><a href="#"><img src="img/fq3.jpg" alt=""></a></li>
        <li><a href="#"><img src="img/fq4.jpg" alt=""></a></li>
    </ul>
</div>
<div class="button-container">
    <button class="next">下一张</button>
</div>

<script src="jquery-1.12.4.js"></script>
<script>
  const $ulLis = $(".slider ul li");
  let sem = 0;
  $(".next").click(function () {
    sem -= 90;
    $ulLis.css({ transform: `rotateX(${sem}deg)` });
  });
</script>
</body>
</html>
